<style>
.danger {
  color: #fd3131;
}
.primary {
  color: #02a7f0;
}

.yud {
  color: #fd3131;
}
.yup {
  color: #02a7f0;
}
</style>
<template>
  <div class="app-container">
    <el-form
      :model="queryParams"
      ref="queryForm"
      size="small"
      :inline="true"
      v-show="showSearch"
      label-width="68px"
    >
      <el-form-item label="ID" prop="taskId">
        <el-input
          v-model="queryParams.taskId"
          placeholder="请输入ID"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="任务编号" prop="taskNo">
        <el-input
          v-model="queryParams.taskNo"
          placeholder="请输入任务编号"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="任务名称" prop="taskName">
        <el-input
          v-model="queryParams.taskName"
          placeholder="请输入任务名称"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="创建人" prop="nickName">
        <el-input
          v-model="queryParams.nickName"
          placeholder="请输入创建人名称"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="参训单位" prop="deptId">
        <el-select
          v-model="queryParams.deptId"
          placeholder="参训单位"
          clearable
        >
          <el-option
            v-for="item in deptOptions"
            :key="item.deptId"
            :label="item.deptName"
            :value="item.deptId"
            :disabled="item.status == 1"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="启用" prop="status">
        <el-select v-model="queryParams.status" placeholder="请选择" clearable>
          <el-option
            v-for="dict in dict.type.sys_normal_disable"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="模式" prop="pattern">
        <el-select v-model="queryParams.pattern" placeholder="请选择" clearable>
          <el-option
            v-for="dict in dict.type.sys_pattern_type"
            :key="dict.value"
            :label="dict.label"
            :value="parseInt(dict.value)"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="提交时间">
        <el-date-picker
          v-model="dateRange"
          style="width: 240px"
          value-format="yyyy-MM-dd"
          type="daterange"
          range-separator="-"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
        ></el-date-picker>
      </el-form-item>
      <el-form-item>
        <el-button
          type="primary"
          icon="el-icon-search"
          size="mini"
          @click="handleQuery"
          >搜索</el-button
        >
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
          >重置</el-button
        >
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['task:add']"
          >新增</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['task:edit']"
          >修改</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          plain
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['task:remove']"
          >删除</el-button
        >
      </el-col>
      <right-toolbar
        :showSearch.sync="showSearch"
        @queryTable="getList"
        :columns="columns"
      ></right-toolbar>
    </el-row>

    <el-table
      ref="tables"
      v-loading="loading"
      :data="taskList"
      @selection-change="handleSelectionChange"
      :default-sort="defaultSort"
      @sort-change="handleSortChange"
    >
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column
        label="ID"
        align="center"
        prop="taskId"
        v-if="columns[0].visible"
        sortable="custom"
        :sort-orders="['descending', 'ascending']"
      />
      <el-table-column
        label="任务编号"
        width="170"
        align="center"
        prop="taskNo"
        v-if="columns[1].visible"
        sortable="custom"
        :sort-orders="['descending', 'ascending']"
      />
      <el-table-column
        label="任务名称"
        align="center"
        prop="taskName"
        v-if="columns[2].visible"
      />
      <el-table-column
        label="创建人"
        align="center"
        prop="nickName"
        v-if="columns[3].visible"
      />
      <el-table-column
        label="参训单位"
        align="center"
        prop="deptName"
        v-if="columns[4].visible"
        width="180"
        :show-overflow-tooltip="true"
      />
      <el-table-column
        label="参与人数"
        align="center"
        prop="headcount"
        v-if="columns[5].visible"
      />
      <el-table-column
        label="终端类型"
        align="center"
        prop="terminalType"
        v-if="columns[6].visible"
      >
        <template slot-scope="scope">
          <dict-tag
            :options="dict.type.sys_terminal_type"
            :value="scope.row.terminalType"
          />
        </template>
      </el-table-column>
      <el-table-column
        label="视频"
        align="center"
        prop="url"
        v-if="columns[7].visible"
      >
        <template slot-scope="scope">
          <div v-if="scope.row.url == null">
            <img
              src="@/assets/images/video_gray.png"
              alt="video"
              style="width: 30px"
            />
          </div>
          <div v-if="scope.row.url != null">
            <a :href="scope.row.url" target="_blank">
              <img
                src="@/assets/images/video_blue.png"
                alt="video"
                style="width: 30px"
              />
            </a>
          </div>
        </template>
      </el-table-column>
      <el-table-column
        label="任务模式"
        align="center"
        key="taskType"
        prop="taskType"
        v-if="columns[8].visible"
      >
        <template slot-scope="scope">
          <dict-tag
            :options="dict.type.sys_task_model"
            :value="scope.row.taskType"
          />
        </template>
      </el-table-column>
      <el-table-column
        label="启用"
        align="center"
        prop="status"
        v-if="columns[9].visible"
        sortable="custom"
        :sort-orders="['descending', 'ascending']"
      >
        <template slot-scope="scope">
          <el-switch
            v-model="scope.row.status"
            :active-value="0"
            :inactive-value="1"
            @change="handleStatusChange(scope.row)"
          ></el-switch>
        </template>
      </el-table-column>
      <el-table-column
        label="任务状态"
        align="center"
        prop="taskStatus"
        v-if="columns[10].visible"
      >
        <template slot-scope="scope">
          <dict-tag
            :options="dict.type.sys_task_status"
            :value="scope.row.taskStatus"
          />
        </template>
      </el-table-column>
      <el-table-column
        label="模式"
        align="center"
        prop="pattern"
        v-if="columns[11].visible"
      >
        <template slot-scope="scope">
          <dict-tag
            :options="dict.type.sys_pattern_type"
            :value="scope.row.pattern"
          />
        </template>
      </el-table-column>
      <el-table-column
        label="备注"
        align="center"
        prop="remark"
        v-if="columns[12].visible"
        width="180"
        :show-overflow-tooltip="true"
      />
      <el-table-column
        label="创建时间"
        align="center"
        prop="createTime"
        v-if="columns[13].visible"
        width="180"
        sortable="custom"
        :sort-orders="['descending', 'ascending']"
      >
        <template slot-scope="scope">
          <span>{{
            parseTime(scope.row.createTime, "{y}-{m}-{d} {h}:{i}:{s}")
          }}</span>
        </template>
      </el-table-column>
      <el-table-column
        label="提交时间"
        align="center"
        prop="submitTime"
        v-if="columns[14].visible"
        width="180"
      >
        <template slot-scope="scope">
          <span>{{
            parseTime(scope.row.submitTime, "{y}-{m}-{d} {h}:{i}:{s}")
          }}</span>
        </template>
      </el-table-column>
      <el-table-column
        label="操作"
        align="center"
        width="160"
        class-name="small-padding fixed-width"
      >
        <template slot-scope="scope">
          <el-row>
            <el-button
              size="mini"
              type="text"
              icon="el-icon-view"
              @click="handleView(scope.row)"
              v-hasPermi="['task:query']"
              >详细</el-button
            >
            <el-button
              v-if="scope.row.taskStatus == 1"
              size="mini"
              type="text"
              icon="el-icon-edit"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['task:edit']"
              >修改</el-button
            >
            <el-dropdown
              size="mini"
              @command="(command) => handleCommand(command, scope.row)"
              v-hasPermi="['system:user:resetPwd', 'system:user:edit']"
            >
              <span class="el-dropdown-link">
                <i class="el-icon-d-arrow-right el-icon--right"></i>更多
              </span>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item
                  command="handleClone"
                  icon="el-icon-copy-document"
                  v-hasPermi="['task:add']"
                  >复制</el-dropdown-item
                >
                <el-dropdown-item
                  v-if="scope.row.taskStatus == 1"
                  command="handleDelete"
                  size="mini"
                  type="text"
                  icon="el-icon-delete"
                  v-hasPermi="['task:remove']"
                  >删除</el-dropdown-item
                >
              </el-dropdown-menu>
            </el-dropdown>
          </el-row>
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 添加或修改任务对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="任务ID:" prop="taskId" v-if="add == false">
          <span>{{ form.taskId }}</span>
        </el-form-item>
        <el-form-item label="任务编号:" prop="taskNo" v-if="add == false">
          <span>{{ form.taskNo }}</span>
        </el-form-item>
        <el-form-item label="任务名称" prop="taskName">
          <el-input v-model="form.taskName" placeholder="请输入任务名称" />
        </el-form-item>
        <el-form-item label="备注" prop="remark">
          <el-input
            v-model="form.remark"
            type="textarea"
            placeholder="请输入备注"
          />
        </el-form-item>
        <el-row>
          <el-col :span="12">
            <el-form-item label="终端类型" prop="terminalType">
              <el-select
                v-model="form.terminalType"
                placeholder="请选择终端类型"
              >
                <el-option
                  v-for="dict in dict.type.sys_terminal_type"
                  :key="dict.value"
                  :label="dict.label"
                  :value="parseInt(dict.value)"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="任务模式" prop="taskType">
              <el-select v-model="form.taskType" placeholder="请选择任务模式">
                <el-option
                  v-for="dict in dict.type.sys_task_model"
                  :key="dict.value"
                  :label="dict.label"
                  :value="parseInt(dict.value)"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="移动方式" prop="move">
              <el-select v-model="form.move" placeholder="请选择移动方式">
                <el-option
                  v-for="dict in dict.type.sys_move_mode"
                  :key="dict.value"
                  :label="dict.label"
                  :value="parseInt(dict.value)"
                  :disabled="dict.status == 1"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="交互方式" prop="interacte">
              <el-select v-model="form.interacte" placeholder="请选择交互方式">
                <el-option
                  v-for="dict in dict.type.sys_interacte_mode"
                  :key="dict.value"
                  :label="dict.label"
                  :value="parseInt(dict.value)"
                  :disabled="dict.status == 1"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="天气设置" prop="weather">
              <el-select v-model="form.weather" placeholder="请选择天气">
                <el-option
                  v-for="dict in dict.type.sys_weather_type"
                  :key="dict.value"
                  :label="dict.label"
                  :value="parseInt(dict.value)"
                  :disabled="dict.status == 1"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="地形设置" prop="terrain">
              <el-select v-model="form.terrain" placeholder="请选择地形">
                <el-option
                  v-for="item in terrainOptions"
                  :key="item.terrainId"
                  :value="parseInt(item.terrainId)"
                  :label="item.terrainName"
                  :disabled="item.status == 1"
                  @change="handleTerrain"
                />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <!--科目设置start-->
        <el-row>
          <el-col :span="24">
            <el-form-item label="单位" prop="deptSubjectId">
              <treeselect
                v-model="form.deptSubjectId"
                :options="subjectOptions"
                :normalizer="normalizer"
                :show-count="true"
                placeholder="选择单位"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="节点" prop="nodeSubjectId">
              <el-select v-model="form.nodeSubjectId" placeholder="请选择">
                <el-option
                  v-for="item in nodeOptions"
                  :key="item.deptId"
                  :label="item.deptName"
                  :value="parseInt(item.deptId)"
                  :disabled="item.status == 1"
                  @change="deviceChange"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="设备类型" prop="deviceSubjectId">
              <el-select v-model="form.deviceSubjectId" placeholder="请选择">
                <el-option
                  v-for="item in deviceOptions"
                  :key="item.deptId"
                  :label="item.deptName"
                  :value="parseInt(item.deptId)"
                  :disabled="item.status == 1"
                  @change="facilityChange"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="设备" prop="facilitySubjectId">
              <el-select v-model="form.facilitySubjectId" placeholder="请选择">
                <el-option
                  v-for="item in facilityOptions"
                  :key="item.deptId"
                  :label="item.deptName"
                  :value="parseInt(item.deptId)"
                  :disabled="item.status == 1"
                  @change="faultChange"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="设备故障" prop="faultSubjectId">
              <el-select v-model="form.faultSubjectId" placeholder="请选择">
                <el-option
                  v-for="item in FaultOptions"
                  :key="item.deptId"
                  :label="item.deptName"
                  :value="parseInt(item.deptId)"
                  :disabled="item.status == 1"
                  @change="changeFaultSubjectId"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="故障现象" prop="faultType">
              <el-radio-group v-model="form.faultType">
                <el-radio
                  v-for="dict in dict.type.sys_fault_type"
                  :key="dict.value"
                  :label="dict.value"
                  :disabled="
                    form.taskNo != null && form.faultType != dict.value
                  "
                  @change="changeFault(dict.value)"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="百分数">
              <el-tooltip
                :content="'百分比的和为100%'"
                style="margin-left: -10px"
              >
                <i class="el-icon-question" />
              </el-tooltip>
              <span>：</span>
              <span :class="{ danger: danger, primary: primary }"
                >{{ percent }}%</span
              >
              <span
                style="margin-left: 2rem"
                :class="{ yud: yud, yup: yup }"
                v-if="yupercent != 0"
                >余：{{ yupercent }}%</span
              >
            </el-form-item>
          </el-col>
        </el-row>

        <!--故障现象-->
        <el-row v-for="dict in causeOptions" :key="dict.key">
          <!-- 随机选中选项 -->
          <div v-if="faultType == 1">
            <div v-if="dict.status === 1">
              <el-col :span="15">
                <el-form-item>
                  <el-input v-model="dict.childName" readonly />
                </el-form-item>
              </el-col>
              <el-col :span="4">
                <el-input v-model="dict.weight" placeholder="百分比" readonly />
              </el-col>
              <el-col :span="1">
                <p style="margin: 10px 0px 0px 5px">%</p>
              </el-col>
            </div>
            <!--随机-->
            <div v-if="dict.status === 2">
              <el-col :span="15">
                <el-form-item>
                  <el-input v-model="dict.childName" :disabled="true" />
                </el-form-item>
              </el-col>
              <el-col :span="4">
                <el-input
                  v-model="dict.weight"
                  placeholder="百分比"
                  :disabled="true"
                />
              </el-col>
              <el-col :span="1"
                ><p style="margin: 10px 0px 0px 5px">%</p></el-col
              >
            </div>
          </div>

          <!-- 设置 -->
          <div v-if="faultType == 2">
            <el-col :span="15">
              <el-form-item>
                <el-input v-model="dict.childName" />
              </el-form-item>
            </el-col>
            <el-col :span="4">
              <el-input
                v-model="dict.weight"
                placeholder="百分比"
                @change="percentum(dict.weight)"
              />
            </el-col>
            <el-col :span="1"><p style="margin: 10px 0px 0px 5px">%</p></el-col>
          </div>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="背包" prop="backpack">
              <el-select v-model="form.backpack" placeholder="请选择">
                <el-option
                  v-for="item in backpackOptions"
                  :key="item.backpackId"
                  :label="item.backpackName"
                  :value="parseInt(item.backpackId)"
                  :disabled="dict.status == 1"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="模式">
              <el-radio-group v-model="form.pattern">
                <el-radio
                  v-for="dict in dict.type.sys_pattern_type"
                  :key="dict.value"
                  :label="parseInt(dict.value)"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="任务难度" prop="taskDifficulty">
              <el-radio-group v-model="form.taskDifficulty">
                <el-radio
                  v-for="dict in dict.type.sys_task_difficulty"
                  :key="dict.value"
                  :label="parseInt(dict.value)"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="任务类别"  prop="taskClass">
              <el-radio-group v-model="form.taskClass">
                <el-radio
                  v-for="dict in dict.type.sys_task_type"
                  :key="dict.value"
                  :label="parseInt(dict.value)"
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <!--科目设置end-->
        <el-form-item
          v-for="item in propNumOptions"
          label="地物设置"
          :key="item.key"
        >
          <el-select
            v-model="item.propId"
            placeholder="请选择地物"
            style="width: 30%"
          >
            <el-option
              v-for="item in porpOptions"
              :key="item.propId"
              :label="item.propName"
              :value="item.propId"
              :disabled="item.status == 1"
            >
            </el-option>
          </el-select>
          <el-select
            v-model="item.propNum"
            placeholder="请选择数量"
            style="width: 30%"
          >
            <el-option
              v-for="dict in dict.type.sys_prop_number"
              :key="dict.value"
              :label="dict.label"
              :value="parseInt(dict.value)"
              :disabled="dict.status == 1"
            >
            </el-option>
          </el-select>
          <el-button type="danger" @click="removePorp(item)"
            ><i class="el-icon-minus"></i
          ></el-button>
        </el-form-item>
        <el-row>
          <el-col>
            <el-form-item>
              <div class="el-form-item__content" style="margin-left: 117px">
                <el-button @click="addPorp">
                  <i class="el-icon-plus"></i>
                </el-button>
              </div>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="参训单位" prop="deptIdsList">
              <el-select
                style="width: 480px"
                v-model="form.deptIdsList"
                multiple
                placeholder="请选择参训单位(可多选)"
              >
                <el-option
                  v-for="item in deptOptions"
                  :key="item.deptId"
                  :label="item.deptName"
                  :value="item.deptId"
                  :disabled="item.status == 1"
                />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>

    <!-- 详细 -->
    <el-dialog
      :title="title"
      :visible.sync="taskView"
      width="900px"
      append-to-body
    >
      <el-form ref="viewForm" :model="viewForm" label-width="100px" size="mini">
        <el-form-item label="基本信息："></el-form-item>
        <el-row>
          <el-col :span="12">
            <el-form-item label="ID：">
              <span>{{ viewForm.taskId }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="任务编号：">
              <span>{{ viewForm.taskNo }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="任务名称：">
              <span>{{ viewForm.taskName }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="任务科目：">
              <el-select v-model="viewForm.faultSubjectId">
                <el-option
                  v-for="item in FaultOptions"
                  :key="item.deptId"
                  :label="item.deptName"
                  :value="parseInt(item.deptId)"
                  :disabled="item.status == 1"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="任务介绍：" :show-overflow-tooltip="true">
              <span>{{ viewForm.remark }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="所选背包：">
              <el-select v-model="viewForm.backpack">
                <el-option
                  v-for="item in backpackOptions"
                  :key="item.backpackId"
                  :label="item.backpackName"
                  :value="parseInt(item.backpackId)"
                  :disabled="dict.status == 1"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="任务模式：">
              <dict-tag
                :options="dict.type.sys_task_model"
                :value="viewForm.taskType"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="视频：">
              <span></span>
              <div v-if="viewForm.url == null">
                <img
                  src="@/assets/images/video_gray.png"
                  alt="video"
                  style="width: 30px"
                />
              </div>
              <div v-if="viewForm.url != null">
                <a :href="viewForm.url" target="_blank">
                  <img
                    src="@/assets/images/video_blue.png"
                    alt="video"
                    style="width: 30px"
                  />
                </a>
              </div>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="终端类型：">
              <dict-tag
                :options="dict.type.sys_terminal_type"
                :value="viewForm.terminalType"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="创建日期：">
              <span>{{
                parseTime(viewForm.createTime, "{y}-{m}-{d} {h}:{i}:{s}")
              }}</span>
            </el-form-item>
          </el-col>
        </el-row>

        <!--故障现象-->
        <el-form-item label="故障现象：">
          <el-radio-group v-model="viewForm.faultType">
            <el-radio
              v-for="dict in dict.type.sys_fault_type"
              :key="dict.value"
              :label="dict.value"
              :disabled="viewForm.faultType != dict.value"
              >{{ dict.label }}</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-table v-loading="loading" :data="causeOptions">
          <!--随机-->
          <div v-if="viewForm.faultType == 1">
            <el-table-column label="百分比" align="center" prop="weight">
              <template slot-scope="scope">
                <span v-if="scope.row.status == '1'" style="color: #13ce66"
                  >{{ scope.row.weight }}%</span>
                <span v-else style="color: #909399"
                  >{{ scope.row.weight }}%</span>
              </template>
            </el-table-column>
            <el-table-column label="故障现象" align="center" prop="childName">
              <template slot-scope="scope">
                <span v-if="scope.row.status == '1'" style="color: #13ce66">{{
                  scope.row.childName
                }}</span>
                <span v-else style="color: #909399">{{
                  scope.row.childName
                }}</span>
              </template>
            </el-table-column>
          </div>
          <!--设置-->
          <div v-if="viewForm.faultType == 2">
            <el-table-column label="百分比" align="center" prop="weight">
              <template slot-scope="scope">
                <span style="color: #13ce66">{{ scope.row.weight }}%</span>
              </template>
            </el-table-column>
            <el-table-column label="故障现象" align="center" prop="childName">
              <template slot-scope="scope">
                <span style="color: #13ce66">{{ scope.row.childName }}</span>
              </template>
            </el-table-column>
          </div>
        </el-table>

        <!--人员信息-->
        <el-form-item
          label="人员信息："
          style="margin-top: 1.5rem"
        ></el-form-item>
        <el-table v-loading="loading" :data="personlTaskList">
          <el-table-column label="ID" align="center" prop="id" />
          <el-table-column label="姓名" align="center" prop="nickName" />
          <!-- <el-table-column label="角色组" align="center" prop="postName" /> -->
          <el-table-column label="单位" align="center" prop="deptName" />
          <el-table-column label="岗位" align="center" prop="postName" />
          <el-table-column
            label="状态"
            align="center"
            key="onlineStatus"
            prop="onlineStatus"
          >
            <template slot-scope="scope">
              <dict-tag
                :options="dict.type.sys_user_online"
                :value="scope.row.onlineStatus"
              />
            </template>
          </el-table-column>
          <el-table-column label="启用" align="center" key="status">
            <template slot-scope="scope">
              <el-switch
                v-model="scope.row.status"
                :active-value="0"
                :inactive-value="1"
                @change="handlePersonlStatusChange(scope.row)"
              ></el-switch>
            </template>
          </el-table-column>
          <el-table-column label="视频" align="center" prop="url">
            <template slot-scope="scope">
              <div v-if="scope.row.url == null">
                <img
                  src="@/assets/images/video_gray.png"
                  alt="video"
                  style="width: 30px"
                />
              </div>
              <div v-if="scope.row.url != null">
                <a :href="scope.row.url" target="_blank">
                  <img
                    src="@/assets/images/video_blue.png"
                    alt="video"
                    style="width: 30px"
                  />
                </a>
              </div>
            </template>
          </el-table-column>
          <el-table-column
            label="操作"
            align="center"
            width="60"
            class-name="small-padding fixed-width"
          >
            <template slot-scope="scope" v-if="scope.row.userId !== 1">
              <el-row>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-view"
                  @click="handleUserView(scope.row.userId)"
                  v-hasPermi="['system:user:query']"
                  >详细</el-button
                >
              </el-row>
            </template>
          </el-table-column>
        </el-table>

        <pagination
          v-show="taskTotal > 0"
          :total="taskTotal"
          :page.sync="taskParams.pageNum"
          :limit.sync="taskParams.pageSize"
          @pagination="getPersonlTaskList"
        />
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="taskView = false">关 闭</el-button>
      </div>
    </el-dialog>

    <!-- 用户详情 -->
    <el-dialog
      :title="userTitle"
      :visible.sync="userView"
      width="900px"
      append-to-body
    >
      <el-form ref="userForm" :model="userForm" label-width="100px" size="mini">
        <el-row>
          <el-col :span="12">
            <el-form-item label="用户账号：">
              <span>{{ userForm.userName }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="ID ：">
              <span>{{ userForm.userId }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="用户名称：">
              <span>{{ userForm.nickName }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="性别：">
              <dict-tag
                :options="dict.type.sys_user_sex"
                :value="userForm.sex"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="手机号码：">
              <span>{{ userForm.phone }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="邮箱：">
              <span>{{ userForm.email }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="归属单位：">
              <span>{{ userForm.deptName }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="职务：">
              <span>{{ userForm.postName }}</span>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="证件号码：">
              <span>{{ userForm.cardNo }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="生日：">
              <span>{{ parseTime(userForm.birthday, "{y}-{m}-{d}") }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="角色 ：">
              <span>{{ userForm.roleName }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="注册时间：">
              <span>{{ parseTime(userForm.createTime) }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="所在城市：">
              <div id="app">
                <el-cascader
                  size="large"
                  :options="regionOptions"
                  v-model="selectedOptions"
                >
                </el-cascader>
              </div>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="个人介绍：">
              <span>{{ userForm.resume }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <!--统计信息-->
        <el-form-item label="统计信息："></el-form-item>
        <el-table v-loading="loading" :data="crontabList">
          <el-table-column
            label="在线时长(分钟)"
            align="center"
            key="onlineTime"
            prop="onlineTime"
            v-if="crontab_columns[0].visible"
          />
          <el-table-column
            label="积分"
            align="center"
            key="integral"
            prop="integral"
            v-if="crontab_columns[1].visible"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="学习科目"
            align="center"
            key="studySubject"
            prop="studySubject"
            v-if="crontab_columns[2].visible"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="训练科目"
            align="center"
            key="trainingSubject"
            prop="trainingSubject"
            v-if="crontab_columns[3].visible"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="考核科目"
            align="center"
            key="assessSubject"
            prop="assessSubject"
            v-if="crontab_columns[4].visible"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="综合排名"
            align="center"
            key="ranking"
            prop="ranking"
            v-if="crontab_columns[5].visible"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="贡献值"
            align="center"
            key="credit"
            prop="credit"
            v-if="crontab_columns[6].visible"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="登录次数"
            align="center"
            key="loginNum"
            prop="loginNum"
            v-if="crontab_columns[7].visible"
            :show-overflow-tooltip="true"
          />
        </el-table>
        <!--任务记录-->
        <el-form-item label="任务记录："></el-form-item>
        <el-table v-loading="loading" :data="userTaskList">
          <el-table-column label="ID" align="center" prop="id" />
          <el-table-column label="任务编号" align="center" prop="taskNo" />
          <el-table-column label="任务名称" align="center" prop="taskName" />
          <el-table-column
            label="任务模式"
            align="center"
            key="taskType"
            prop="taskType"
          >
            <template slot-scope="scope">
              <dict-tag
                :options="dict.type.sys_task_model"
                :value="scope.row.taskType"
              />
            </template>
          </el-table-column>
          <el-table-column label="岗位" align="center" prop="postName" />
          <el-table-column label="视频" align="center" prop="url">
            <template slot-scope="scope">
              <div v-if="scope.row.url == null">
                <img
                  src="@/assets/images/video_gray.png"
                  alt="video"
                  style="width: 30px"
                />
              </div>
              <div v-if="scope.row.url != null">
                <a :href="scope.row.url" target="_blank">
                  <img
                    src="@/assets/images/video_blue.png"
                    alt="video"
                    style="width: 30px"
                  />
                </a>
              </div>
            </template>
          </el-table-column>
          <el-table-column
            label="时长"
            align="center"
            prop="durationTime"
            sortable="custom"
            :sort-orders="['descending', 'ascending']"
          />
          <el-table-column
            label="成绩"
            align="center"
            prop="grade"
            sortable="custom"
            :sort-orders="['descending', 'ascending']"
          />
          <el-table-column
            label="提交时间"
            align="center"
            prop="submitTime"
            width="180"
          >
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.submitTime) }}</span>
            </template>
          </el-table-column>

          <el-table-column
            label="操作"
            align="center"
            width="60"
            class-name="small-padding fixed-width"
          >
            <template slot-scope="scope" v-if="scope.row.userId !== 1">
              <el-row>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-view"
                  @click="handleTaskView(scope.row.userId)"
                  v-hasPermi="['monitor:operlog:query']"
                  >详细</el-button
                >
              </el-row>
            </template>
          </el-table-column>
        </el-table>

        <pagination
          v-show="userTaskTotal > 0"
          :total="userTaskTotal"
          :page.sync="taskParams.pageNum"
          :limit.sync="taskParams.pageSize"
          @pagination="getPersonlTaskList"
        />
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="userView = false">关 闭</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  listTask,
  getTask,
  delTask,
  addTask,
  updateTask,
  changeTaskStatus,
  cloneTask,
} from "@/api/task/task";
import { listPersonlTask, changeUserTaskStatus } from "@/api/task/personlTask";
import { listBackpack } from "@/api/category/backpack";
import { listPorp } from "@/api/category/porp";
import { listSubject, faultList } from "@/api/category/subject";
import { listDept } from "@/api/system/dept";
import Treeselect from "@riophae/vue-treeselect";
import { regionData } from "element-china-area-data";
import { getUser, getUserCrontab } from "@/api/system/user";
import { listTerrain } from "@/api/category/terrain";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";

export default {
  name: "Task",
  components: { Treeselect },
  dicts: [
    "sys_normal_disable",
    "sys_task_status",
    "sys_task_model",
    "sys_terminal_type",
    "sys_move_mode",
    "sys_interacte_mode",
    "sys_weather_type",
    "sys_backpack_type",
    "sys_prop_number",
    "sys_user_online",
    "sys_user_sex",
    "sys_pattern_type",
    "sys_fault_type",
    "sys_task_difficulty",
    "sys_task_type"
  ],
  //监听下拉项
  watch: {
    "form.deptSubjectId": "nodeChange",
    "form.nodeSubjectId": "deviceChange",
    "form.deviceSubjectId": "facilityChange",
    "form.facilitySubjectId": "faultChange",
    "form.faultSubjectId": "changeFaultSubjectId",
    "form.terrain": "handleTerrain",
  },
  data() {
    return {
      danger: false,
      primary: false,
      yud: false,
      yup: false,
      //新增
      add: false,
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      operTime: 0,
      // 总条数
      total: 0,
      userTaskTotal: 0,
      // 默认排序
      defaultSort: { prop: "updateTime", order: "descending" },
      //区域三级联动
      regionOptions: regionData,
      selectedOptions: [],
      // 任务表格数据
      taskList: [],
      // 单位选项
      deptOptions: [],
      //单位选项
      subjectOptions: [],
      //节点选项
      nodeOptions: [],
      //设备类型
      deviceOptions: [],
      //设备
      facilityOptions: [],
      //设备故障
      FaultOptions: [],
      //背包数组
      backpackOptions: [],
      //物品数组
      porpOptions: [],
      //地形设置
      terrainOptions: [],
      // 用户任务表格数据
      personlTaskList: [],
      userTaskList: [],
      //用户任务总数
      taskTotal: 0,
      // 弹出层标题
      title: "",
      userTitle: "",
      // 日期范围
      dateRange: [],
      // 是否显示弹出层
      open: false,
      //设备故障ID
      faultId: 0,
      //默认故障现象
      faultType: "1",
      //故障现象数组
      causeOptions: [],
      //百分数
      percent: 100,
      //百分数余数
      yupercent: 0,
      //固定百分数
      fixedPercent: 100,
      //是否弹出详情
      taskView: false,
      userView: false,
      //保存用户详情任务记录的用户ID
      taskUserId: 0,
      // 用户统计数据
      crontabList: null,
      type: "1",
      //任务编号
      taskNo: 0,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        taskId: null,
        pattern: null,
        taskNo: null,
        taskName: null,
        nickName: null,
        deptId: null,
        status: null,
        submitTime: null,
      },

      //列表信息
      columns: [
        { key: 0, label: `ID`, visible: false },
        { key: 1, label: `任务编号`, visible: true },
        { key: 2, label: `任务名称`, visible: true },
        { key: 3, label: `创建人`, visible: false },
        { key: 4, label: `参训单位`, visible: true },
        { key: 5, label: `参与人数`, visible: true },
        { key: 6, label: `终端类型`, visible: false },
        { key: 7, label: `视频`, visible: true },
        { key: 8, label: `任务模式`, visible: true },
        { key: 9, label: `启用`, visible: true },
        { key: 10, label: `任务状态`, visible: true },
        { key: 11, label: `模式`, visible: false },
        { key: 12, label: `备注`, visible: true },
        { key: 13, label: `创建时间`, visible: false },
        { key: 14, label: `提交时间`, visible: true },
      ],

      // 任务记录查询参数
      taskParams: {
        pageNum: 1,
        pageSize: 10,
        taskNo: undefined,
        userId: undefined,
      },
      //查询科目设置选项参数
      querySelect: {
        parentId: 0,
        type: "0",
        status: "0",
      },
      // 表单参数
      form: {},
      viewForm: {},
      userForm: {},
      //表单动态增减部分
      propNumOptions: [
        {
          propId: "",
          propNum: "",
        },
      ],
      //用户统计列信息
      crontab_columns: [
        { key: 0, label: `在线时长(分钟)`, visible: true },
        { key: 1, label: `积分`, visible: true },
        { key: 2, label: `学习科目`, visible: true },
        { key: 3, label: `训练科目`, visible: true },
        { key: 4, label: `考核科目`, visible: true },
        { key: 5, label: `综合排名`, visible: true },
        { key: 6, label: `贡献值`, visible: true },
        { key: 7, label: `登录次数`, visible: true },
      ],
      // 表单校验
      rules: {
        taskName: [
          { required: true, message: "任务名称不能为空", trigger: "blur" },
          {
            min: 2,
            max: 20,
            message: "任务名称长度必须介于 2 和 20字符之间",
            trigger: "blur",
          },
        ],

        remark: [
          {
            min: 0,
            max: 200,
            message: "备注长度必须不能大于200字符",
            trigger: "blur",
          },
        ],
        terminalType: [
          { required: true, message: "终端类型不能为空", trigger: "blur" },
        ],
        taskType: [
          { required: true, message: "任务模式不能为空", trigger: "blur" },
        ],
        deptSubjectId: [
          { required: true, message: "单位不能为空", trigger: "blur" },
        ],
        nodeSubjectId: [
          { required: true, message: "节点不能为空", trigger: "blur" },
        ],
        deviceSubjectId: [
          { required: true, message: "设备类型不能为空", trigger: "blur" },
        ],
        facilitySubjectId: [
          { required: true, message: "设备不能为空", trigger: "blur" },
        ],
        faultSubjectId: [
          { required: true, message: "设备故障不能为空", trigger: "blur" },
        ],
        backpack: [
          { required: true, message: "背包不能为空", trigger: "blur" },
        ],
        weather: [
          { required: true, message: "天气设置不能为空", trigger: "blur" },
        ],
        terrain: [
          { required: true, message: "地形设置不能为空", trigger: "blur" },
        ],
        taskClass: [
          { required: true, message: "请选择任务类别", trigger: "blur" },
        ],
        taskDifficulty: [
          { required: true, message: "请选择任务难度", trigger: "blur" },
        ],
      },
    };
  },
  created() {
    this.getList();
    this.getListDept();
  },
  methods: {
    //动态添加地物设置
    addPorp() {
      this.propNumOptions.push({
        propNum: "", //输入框
        key: Date.now(),
      });
    },
    //动态删除地物设置
    removePorp(item) {
      var index = this.propNumOptions.indexOf(item);
      if (index !== 0) {
        this.propNumOptions.splice(index, 1);
      }
    },

    /** 查询任务列表 */
    getList() {
      this.loading = true;
      listTask(this.addDateRange(this.queryParams, this.dateRange)).then(
        (response) => {
          this.taskList = response.rows;
          this.total = parseInt(response.total);
          this.loading = false;
        }
      );
    },

    /** 查询单位列表 */
    getListDept() {
      listDept({ pageSize: 1000 }).then((response) => {
        this.deptOptions = response.data;
      });
    },

    /** 转换类别数据结构 */
    normalizer(node) {
      if (node.children && !node.children.length) {
        delete node.children;
      }
      return {
        id: node.deptId,
        label: node.deptName,
        children: node.children,
      };
    },

    /** 查询类别下拉树结构 */
    getTreeselect(query) {
      listSubject(query).then((response) => {
        this.subjectOptions = [];
        const subject = { deptId: 0, deptName: "主类别", children: [] };
        subject.children = this.handleTree(response.data, "deptId");
        this.subjectOptions.push(subject);
      });
    },

    //节点选项
    nodeChange(parentId) {
      if (this.add) {
        if (this.form.nodeSubjectId != null) {
          this.form.nodeSubjectId = null;
        }
        if (this.form.deviceSubjectId != null) {
          this.form.deviceSubjectId = null;
        }
        if (this.form.facilitySubjectId != null) {
          this.form.facilitySubjectId = null;
        }
        if (this.form.faultSubjectId != null) {
          this.form.faultSubjectId = null;
        }
      }
      (this.querySelect.parentId = parentId),
        (this.querySelect.type = "2"),
        listSubject(this.querySelect).then((response) => {
          this.nodeOptions = response.data;
        });
    },
    //设备类型选项
    deviceChange(parentId) {
      if (this.add) {
        if (this.form.deviceSubjectId != null) {
          this.form.deviceSubjectId = null;
        }
        if (this.form.facilitySubjectId != null) {
          this.form.facilitySubjectId = null;
        }
        if (this.form.faultSubjectId != null) {
          this.form.faultSubjectId = null;
        }
      }

      (this.querySelect.parentId = parentId),
        (this.querySelect.type = "3"),
        listSubject(this.querySelect).then((response) => {
          this.deviceOptions = response.data;
        });
    },

    //设备选项
    facilityChange(parentId) {
      if (this.add) {
        if (this.form.facilitySubjectId != null) {
          this.form.facilitySubjectId = null;
        }
        if (this.form.faultSubjectId != null) {
          this.form.faultSubjectId = null;
        }
      }
      (this.querySelect.parentId = parentId),
        (this.querySelect.type = "4"),
        listSubject(this.querySelect).then((response) => {
          this.facilityOptions = response.data;
        });
    },

    //设备故障
    faultChange(parentId) {
      if (this.add) {
        if (this.form.faultSubjectId != null) {
          this.form.faultSubjectId = null;
        }
      }
      (this.querySelect.parentId = parentId),
        (this.querySelect.type = "5"),
        listSubject(this.querySelect).then((response) => {
          this.FaultOptions = response.data;
        });
    },

    //选择故障默认搜索随机故障现象
    changeFaultSubjectId(parentId) {
      this.faultId = parentId;
      this.handleFault(this.faultType, parentId);
    },

    //选择故障现象随机=1，设置=2
    changeFault(faultType) {
      this.faultType = faultType;
      this.handleFault(faultType, this.faultId);
    },

    /** 故障现象列表 */
    handleFault(faultType, faultId) {
      if (faultId != undefined) {
        faultList(faultType, faultId, this.taskNo).then((response) => {
          this.causeOptions = response.data;
          this.percentum(1);
        });
      }
    },

    //百分比累加判断
    percentum(weight) {
      var total = 0;
      // var numRe = new RegExp(/^[0-9]\d*(\.\d+)?$/);    //可以输入小数的非负数
      var numRe = new RegExp(/^[0-9]\d*$/);
      if (!numRe.test(weight)) {
        this.$modal.msgError("请输入非负正数！");
        return false;
      }

      if (weight < 0) {
        this.$modal.msgError("百分数不能小于0！");
        return false;
      }
      //循环累加
      this.causeOptions.forEach((ca) => {
        total += ca.weight * 1;
      });

      if (parseInt(total) != this.fixedPercent) {
        this.$modal.msgError("百分数的和必须为100%！");
        this.percent = total;
        this.danger = true;
        this.primary = false;
        this.yud = true;
        this.yup = false;
        //余数
        this.yupercent = this.fixedPercent - total;
      } else {
        this.percent = total;
        this.danger = false;
        this.primary = true;
        this.yupercent = 0;
        this.yud = false;
        this.yup = true;
      }
    },

    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
      this.operTime = 0;
    },
    // 表单重置
    reset() {
      this.form = {
        taskId: null,
        taskNo: null,
        taskName: null,
        userId: null,
        deptIds: null,
        headcount: null,
        terminalType: null,
        url: null,
        grade: null,
        taskType: null,
        status: null,
        delFlag: null,
        remark: null,
        taskClass:1,
        taskDifficulty:1,
        pattern: 1,
        faultType: null,
        startTime: null,
        submitTime: null,
        createTime: null,
        updateTime: null,
        move: null,
        interacte: null,
        weather: null,
        terrain: null,
      };
      this.taskNo = 0;
      this.faultId = 0;
      this.percent = 100;
      this.causeOptions = [];
      this.form.faultType = null;
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.dateRange = [];
      this.$refs.tables.sort(this.defaultSort.prop, this.defaultSort.order);
      this.resetForm("queryForm");
      this.handleQuery();
    },
    /** 排序触发事件 */
    handleSortChange(column, prop, order) {
      this.queryParams.orderByColumn = column.prop;
      this.queryParams.isAsc = column.order;
      this.getList();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.taskId);
      this.single = selection.length !== 1;
      this.multiple = !selection.length;
    },
    /** 查询物品信息列表 */
    handleTerrain(terrain) {
      this.operTime++;
      if (terrain != null) {
        listPorp({ status: 0, terrainId: terrain, pageSize: 1000 }).then(
          (response) => {
            this.porpOptions = response.rows;
            if (this.add) {
              this.propNumOptions = [{ propId: "", propNum: "" }];
            } else if (this.operTime > 2) {
              this.propNumOptions = [{ propId: "", propNum: "" }];
            }
          }
        );
      }
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.add = true;
      this.reset();
      this.form.faultType = "1";
      /** 查询地图列表 */
      listTerrain({ status: 0, pageSize: 1000 }).then((response) => {
        this.terrainOptions = response.rows;
      });
      /** 查询背包列表 */
      listBackpack({ status: 0, pageSize: 1000 }).then((response) => {
        this.backpackOptions = response.rows;
      });
      (this.propNumOptions = [
        {
          propId: "",
          propNum: "",
        },
      ]),
        (this.querySelect.type = "1"),
        this.getTreeselect(this.querySelect);
      this.open = true;
      this.title = "添加任务";
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      //任务编号
      this.taskNo = row.taskNo;
      /** 查询地图列表 */
      listTerrain({ pageSize: 1000 }).then((response) => {
        this.terrainOptions = response.rows;
      });
      /** 查询物品信息列表 */
      listPorp({ pageSize: 1000 }).then((response) => {
        this.porpOptions = response.rows;
      });
      /** 查询背包列表 */
      listBackpack({ pageSize: 1000 }).then((response) => {
        this.backpackOptions = response.rows;
      });
      this.add = false;

      //单位列表
      listSubject({ type: "1" }).then((response) => {
        this.subjectOptions = [];
        const subject = { deptId: 0, deptName: "主类别", children: [] };
        subject.children = this.handleTree(response.data, "deptId");
        this.subjectOptions.push(subject);
      });

      const taskId = row.taskId || this.ids;
      getTask(taskId).then((response) => {
        this.form = response.data;
        this.faultType = this.form.faultType;
        this.propNumOptions = response.data.propNumOptions;
        this.open = true;
        this.title = "修改任务";
      });
    },

    /** 详细按钮操作 */
    handleView(row) {
      this.taskNo = row.taskNo;
      this.taskView = true;
      const taskId = row.taskId;
      getTask(taskId).then((response) => {
        this.viewForm = response.data;
        this.title = "任务详情";
      });

      //任务科目
      listSubject({ parentId: row.faultSubjectId, type: "5" }).then(
        (response) => {
          this.FaultOptions = response.data;
        }
      );

      /** 查询背包列表 */
      listBackpack({ pageSize: 1000 }).then((response) => {
        this.backpackOptions = response.rows;
      });

      //人员信息
      this.getPersonlTaskList();

      //故障现象
      this.handleFault(0, 0);
    },

    /** 查询用户任务列表 */
    getPersonlTaskList() {
      this.taskParams.taskNo = this.taskNo;
      listPersonlTask(this.taskParams).then((response) => {
        this.personlTaskList = response.rows;
        this.taskTotal = response.total;
      });
    },
    //启用状态修改
    handleStatusChange(row) {
      let text = row.status === 0 ? "开始" : "停止";
      this.$modal
        .confirm(
          "确认要" +
            text +
            '编号为"' +
            row.taskNo +
            "的" +
            row.taskName +
            '"任务吗？'
        )
        .then(function () {
          return changeTaskStatus(row.taskId, row.status);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess(text + "成功");
        })
        .catch(function () {
          row.status = row.status === 0 ? 1 : 0;
        });
    },

    //用户启用状态修改
    handlePersonlStatusChange(row) {
      let text = row.status === 1 ? "移除" : "启用";
      this.$modal
        .confirm("确认要" + text + '"' + row.nickName + '"用户吗？')
        .then(function () {
          return changeUserTaskStatus(row.id, row.status);
        })
        .then(() => {
          this.$modal.msgSuccess(text + "成功");
        })
        .catch(function () {
          row.status = row.status === 1 ? 0 : 1;
        });
    },
    // 更多操作触发
    handleCommand(command, row) {
      switch (command) {
        case "handleDelete":
          this.handleDelete(row);
          break;
        case "handleClone":
          this.handleClone(row);
          break;
        default:
          break;
      }
    },
    /** 提交按钮 */
    submitForm() {
      this.form.propNumStr = JSON.stringify(this.propNumOptions);
      this.form.causeStr = JSON.stringify(this.causeOptions);
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.percent != this.fixedPercent) {
            this.$modal.msgError("百分数的和必须为100%");
            return false;
          }

          if (this.form.taskId != null) {
            updateTask(this.form).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.operTime = 0;
              this.open = false;
              this.getList();
            });
          } else {
            addTask(this.form).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.operTime = 0;
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const taskIds = row.taskId || this.ids;
      this.$modal
        .confirm('是否确认删除任务编号为"' + taskIds + '"的数据项？')
        .then(function () {
          return delTask(taskIds);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },

    /** 复制按钮操作 */
    handleClone(row) {
      const taskId = row.taskId;
      const taskNo = row.taskNo;
      this.$modal
        .confirm('确认复制任务编号为"' + taskNo + '"的数据项？')
        .then(function () {
          return cloneTask(taskId, taskNo);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("复制成功");
        })
        .catch(() => {});
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download(
        "task/task/export",
        {
          ...this.queryParams,
        },
        `task_${new Date().getTime()}.xlsx`
      );
    },

    /** 用户详细按钮操作 */
    handleUserView(userId) {
      this.taskUserId = userId;
      this.userView = true;
      getUser(userId).then((response) => {
        this.userForm = response.data;
        this.userTitle = "用户详情";

        this.selectedOptions = [
          response.data.province + "",
          response.data.city + "",
          response.data.district + "",
        ];
      });

      //用户统计信息
      getUserCrontab(userId).then((response) => {
        this.crontabList = response.data;
      });

      this.getPersonlTaskListByuserId();
    },
    /** 查询用户任务列表 */
    getPersonlTaskListByuserId() {
      this.taskParams.userId = this.taskUserId;
      listPersonlTask(this.taskParams).then((response) => {
        this.userTaskList = response.rows;
        this.userTaskTotal = response.total;
      });
    },
  },
};
</script>
